import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HeroService } from '../../../../services/hero.service';
import { NzMessageService, NzModalService } from 'ng-zorro-antd';
import {
  FormBuilder,
  FormControl,
  FormGroup,
  Validators
} from '@angular/forms';

@Component({
  selector: 'app-addacount',
  templateUrl: './addacount.component.html',
  styleUrls: ['./addacount.component.css']
})
export class AddacountComponent implements OnInit {

  validateForm: FormGroup;
  btn_loading = false;
  type = false;
  rolelist: Array<any> = [];
  roleCheck: Array<any> = [];
  roleCheckIds: Array<any> = [];
  checkUsername: number;

  submitForm(): void {
    for (const i in this.validateForm.controls) {
      this.validateForm.controls[i].markAsDirty();
      this.validateForm.controls[i].updateValueAndValidity();
    }
  }

  constructor(private heroService: HeroService,
    private fb: FormBuilder,
    private router: Router,
    private message: NzMessageService,
    private modalService: NzModalService) { }


  phoneNUmberValidator = (control: FormControl): { [s: string]: boolean } => {
    if (!control.value) {
      return { required: true };
    } else if (!(/^1\d{10}$/.test(control.value))) {
      return { confirm: true, error: true };
    }
  }

  ngOnInit(): void {
    this.validateForm = this.fb.group({
      username1: [null, [Validators.required]],
      pwd1: [null, [Validators.required]],
      name: [null, [Validators.required]],
      phoneNumberPrefix: ['+86'],
      phoneNumber: [null, [Validators.required]],
      checkOptions: [null],
      remark: ['']
    });
    // 获取权限列表
    let url = host + "/main/merchantSubAcount/add";
    this.heroService.get(url).then(result => {
      this.rolelist = result.data.roles;
      this.rolelist.map((item) => {
        this.roleCheck.push({ label: item.name, value: item.id });
      })
      this.validateForm.get('checkOptions').setValue(this.roleCheck);
    })
  }

  addAcount() {
    if (this.validateForm.status == "VALID" && this.checkUsername != -1) {
      this.btn_loading = true;
      let url = host + "/main/merchantSubAcount/save";
      let model = 'username=' + this.validateForm.value.username1 + '&pwd=' + this.validateForm.value.pwd1 + '&name=' + this.validateForm.value.name + '&mobile=' + this.validateForm.value.phoneNumber + '&roleIds=' + this.roleCheckIds + '&remark=' + this.validateForm.value.remark;
      this.heroService.post(url, model).then(result => {
        this.btn_loading = false;
        if (result.code == 0) {
          this.message.success('添加成功');
          this.router.navigate(['/main/acount']);
        } else {
          this.modalService.error({
            nzTitle: '提示',
            nzContent: result.msg
          });
        }
      })
    }
  }

  log(): void {
    this.roleCheckIds = [];
    this.validateForm.get('checkOptions').value.filter((item) => item.checked).map((item) => {
      this.roleCheckIds.push(item.value);
    })
    console.log(this.roleCheckIds);
  }
  checkMobile() {
    this.validateForm.get('phoneNumber')!.setValidators(this.phoneNUmberValidator);
    this.validateForm.get('phoneNumber')!.markAsDirty();
    this.validateForm.get('phoneNumber')!.updateValueAndValidity();
  }
  clearCheckMobile() {
    this.validateForm.get('phoneNumber')!.clearValidators();
    this.validateForm.get('phoneNumber')!.markAsPristine();
    this.validateForm.get('phoneNumber')!.updateValueAndValidity();
  }
  checkUser() {
    if (this.validateForm.value.username1) {
      //只能输入字母、数字、下划线的组合
      let regex = /^[a-zA-Z0-9][\w-_]{5,13}$/g;
      if (regex.test(this.validateForm.value.username1)) {
        this.checkUsername = 0;
      } else {
        this.checkUsername = -1;
      }
    }
  }
  backPrevent() {
    return false;
  }
  autoFocus(){
    this.type=true;
  }
}
